<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title> 登录 </title>
    <link rel="shortcut icon" href="/static/img/logo/favicon.ico" />
    <link href="/static/assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
    <section class="h-100">
        <div class="container h-100" >
            <div class="row justify-content-sm-center h-100">
                <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-7 col-sm-9 pt-5">
                    <div class="text-center my-5">
                        <img src="/static/img/logo/logo.png" alt="logo"
                            width="450">
                    </div>
                    <div class="card shadow-lg">
                        <div class="card-body p-5">
                            <h1 class="fs-4 card-title fw-bold mb-4">登录</h1>
                            <form method="POST" class="needs-validation" novalidate="" autocomplete="off">{% csrf_token %}
                                <div class="mb-3">
                                    <label class="mb-2 text-muted" for="uid">用户名 </label>
                                    <input id="uid" type="text" class="form-control rounded-pill" name="uid" value="" required
                                        autofocus>
                                    <div class="invalid-feedback">
                                        用户不能为空！
                                    </div>
                                </div>

                                <div class="mb-3">
                                    <div class="mb-2 w-100">
                                        <label class="text-muted" for="pwd">密码</label>
                                        <a href="forgot.html" class="link-secondary float-end">
                                            忘记密码?
                                        </a>
                                    </div>
                                    <input id="pwd" type="password" class="form-control rounded-pill" name="pwd" required>
                                    <div class="invalid-feedback">
                                        必须填写密码
                                    </div>
                                </div>

                                <div class="d-flex align-items-center">
                                    <div class="form-check">
                                        <input type="checkbox" name="remember" id="remember" class="form-check-input">
                                        <label for="remember" class="form-check-label">记住我</label>
                                    </div>
                                    <button  type="submit" class="btn btn-secondary ms-auto rounded-pill">
                                        登录
                                    </button>
                                </div>
                            </form>
                        </div>
                        <div class="card-footer py-3 border-0">
                            <div class="text-center">
                                没有用户? <a href="/register/" class="link-secondary">注册一个</a>
                            </div>
                        </div>
                    </div>
                    <div class="text-center mt-5 text-muted">
                        Copyright &copy; 2021-2022 &mdash; 17毕设
                    </div>
                </div>
            </div>
        </div>
    </section>

<script src="/static/js/login.js"></script>
<script src="/static/assets/plugins/jquery/jquery.min.js"></script>
{% if result %}
<script>
    $(document).ready(function () {
        alert('{{ msg }}');
    });
</script>
{% endif %}
</body>

</html>


